Mobile App Beat-Wise Performance
I want to view a breakdown of sales performance metrics categorized by individual "Beats" (sales routes/territories) on the mobile app,
So that I can monitor order volume, revenue generation, and retailer coverage for specific areas across different timeframes (Daily, Monthly, and Yearly).
1. UI & Navigation:
- The screen must have a red header titled "Beat Wise Performance".
- The header must include a "Back" arrow (to return to the previous menu) and a "Home" icon (to return to the main dashboard).
- The screen should display a vertically scrollable list of individual cards, where each card represents a distinct Beat.
2. Beat Card Header & Identifiers:
- Each card must feature a distinct blue header containing a route/path icon followed by the Beat Name (e.g., "Beat 001", "Mansarovar").
- Below the blue header, the card must display the name of the assigned sales employee (e.g., "Emp Sales 2 60 (RJ)"). This text should be formatted as a clickable hyperlink, which navigates the user to that specific employee's profile or performance dashboard.
3. Retailer Coverage:
- Below the employee name, the card must display a "Retailers (Count)" hyperlink (e.g., "Retailers (1)").
- The count must dynamically reflect the total number of retailers mapped to that specific Beat.
- Tapping this hyperlink must navigate the user to a detailed list of the retailers located within that Beat.
4. Performance Metrics Grid:
- The bottom half of the card (separated by a dashed line) must contain a structured performance matrix.
- The matrix must include two primary columns: Order Count and Order Revenue.
- The metrics must be broken down into three distinct rows representing the following timeframes:
- FTD (For The Day / For Today)
- MTD (Month To Date)
- YTD (Year To Date)
- The system must accurately fetch and display the corresponding numerical data for both count and revenue under each timeframe. (e.g., YTD Order Count: 4, YTD Order Revenue: 2947.0).